<template>
    <el-table :data="tableData" show-summary>
      <el-table-column prop="name" label="Name"></el-table-column>
      <el-table-column prop="amounts" label="Amounts"></el-table-column>
      <el-table-column prop="amount" label="Amount"></el-table-column>
      <el-table-column label="Custom Sum">
        <template #summary="{ columns, data }">
          <span>{{ calculateCustomSum(data, columns[2]) }}</span>
        </template>
      </el-table-column>
    </el-table>
  </template>
  
  <script setup>
  import { ref,onMounted } from 'vue';
  
  import { useRoute } from "vue-router";

// 定义变量内容
const route = useRoute();

// 页面加载时
onMounted(() => {
  // 参数：params: { "t": "vue-next-admin", "id": "111" }
  console.log(route.params);
});


  const tableData = ref([
    { name: 'Item 1', amount: 100, amounts: 100 },
    { name: 'Item 2', amount: 200, amounts: 200 },
    { name: 'Item 3', amount: 300, amounts: 300 },
  ]);
  
  // 计算某一列的合计
  const calculateCustomSum = (data, column) => {
    const values = data.map(item => Number(item[column.property]));
    return values.reduce((acc, val) => acc + val, 0);
  };
  </script>
  